<style scoped>
  [v-cloak] {
    display: block;
  }

  .brand_ul1 li p {
    font-size: 16px;
  }

  .brand_ul2 li h3 {
    font-size: 18px;
  }

  .brand_span {
    font-size: 16px;
  }

  * {
    font-family: '微软雅黑';
  }

  .topc_answer ul li {
    position: relative;
  }

  .topc_answer ul li:after {
    position: absolute;
    content: '';
    width: 5px;
    height: 5px;
    background: #000;
    left: -14px;
    top: 32px;
    border-radius: 50%;
  }

  .topc_answer ul li h3, .brand_ul2 li h3, .brand_ul3 li div h3, .brand_newscar > li > ul > li {
    text-align: left;
  }

  .brand_newscar > li > ul > li {
    font-size: 16px;
  }

  .brand_ul3 li div h3 {
    font-size: 18px;
  }

  .more, .brand_ul3 li div p, .friendlink li {
    font-size: 16px;
  }

  .brand_ul2 li {
    margin-top: 30px;
    margin-bottom: 30px;
    overflow: hidden;
    text-align: left;
    list-style-type: none;
    background: url(../../static/image/sy_11.png) no-repeat;
    padding-left: 33px;
    background-position: 8px 6px;
    background-size: 13px;
  }

  .topc_answer ul li h3, .brand_ul2 li h3, .brand_ul3 li div h3, .brand_newscar > li > ul > li {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
  }

  .topc_answer ul li p, .brand_ul2 li p, .brand_ul3 li div p {
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .brand_ul3 li div p {
    -webkit-line-clamp: 3;
    line-clamp: 3;
  }

  .brand_newscar > li > ul {
    height: 245px;
  }

  .brand_newscar li > h3 {
    height: 60px;
  }

  .topc_search_l ul {
    height: 75px;
    overflow: hidden;
  }

  .topc_search_l ul li {
    margin-right: 13px;
    line-height: 25px;
  }

  .topc_search_l > h2 {
    margin: 26px 0px 8px;
  }

  .topc_five .topc_search_l:last-child {
    border-bottom: 0px;
  }

  .swiper-container-name .swiper-container-horizontal {
    margin-top: 0px !important;
  }

  .coper_swiper {
    margin: 0 auto !important;
  }

  .more {
    margin: 26px auto 0px;
  }

  .topc_right_ul1 li {
    position: relative;
  }

  .topc_right_ul1 > li:hover {
    background: #9fe5ff;
    color: #000;
  }

  .topc_right_ul1 li ul {
    position: absolute;
    width: 150px;
    background: #fff;
    border: 1px solid #cccccc;
    z-index: 333333333;
    padding: 18px 0px;
  }

  .topc_right_ul1 > li ul {
    display: none;
  }

  .topc_right_ul1 > li:hover ul {
    display: block;
  }

  .topc_right_ul1 li ul li {
    line-height: 35px;
  }
</style>
<style>
  .answer_nok {
    width: 100%;
    height: 194px;
  }

  .answer_nok .swiper-container {
    height: 194px;
    padding: 0px 10px 0px 20px;
    padding-top: 15px;
  }

  .answer_nok .swiper-container p {
    font-size: 14px;
    line-height: 28px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
  }

  .answer_nok .swiper-container h3 {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-all;
    font-size: 17px;
    margin-bottom: 5px;
    font-weight: normal;
  }

  .swiper-container-name .swiper-pagination {
    width: 100% !important;
  }
</style>
<template>
  <div v-cloak v-show="show">
    <div>
      <Header></Header>
    </div>
    <div class="change_pass nav_bg">
      <div class="topc top_navc">
        <div class="topc_search">
          <div class="search_title">精准搜索</div>
          <div class="topc_five">
            <div class="topc_search_l">
              <h2>热门品牌</h2>
              <ul>
                <li :key="index" v-for="(item,index) in getHotBrandList">{{item.ca_name}}</li>
              </ul>
            </div>
            <div class="topc_search_l" v-for="(item,index) in getIndexSearchList">
              <h2>{{item.ca_name}}</h2>
              <ul>
                <li v-for="(item_ca,index_ca) in item.list">{{item_ca.ca_name}}</li>
              </ul>
            </div>
          </div>
        </div>
        <div class="topc_righta">
          <ul class="topc_right_ul1">
            <li class="active">首页</li>
            <li>产品<img src="../../static/image/jz_6.png">
              <ul>
                <li v-for="(item,index) in navlist[0]" @click="proudce(item)">{{item.la_name}}</li>
              </ul>
            </li>
            <li>服务<img src="../../static/image/jz_6.png">
              <ul>
                <li v-for="(item,index) in navlist[1]">{{item}}</li>
              </ul>
            </li>
            <li>资讯<img src="../../static/image/jz_6.png">
              <ul>
                <li @click="consult('资讯', item.ca_name, item.ca_id)" v-for="(item,index) in navlist[2]">{{item.ca_name}}</li>
              </ul>
            </li>
            <li>论坛<img src="../../static/image/jz_6.png">
              <ul>
                <li @click="toBbs(index)" v-for="(item,index) in navlist[3]">{{item}}</li>
              </ul>
            </li>
            <li>
              车评中心<img src="../../static/image/jz_6.png">
              <ul>
                <li @click="vehiclecenter(item)" v-for="(item,index) in navlist[4]">{{item}}</li>
              </ul>
            </li>
            <li>车型对比</li>
          </ul>
          <div class="topc_swiper">
            <div class="scroll swiper-container-name">
              <swiper :options="swiperOption" ref="mySwiper" v-if="getBannerList.length>1">
                <!-- slides -->
                <swiper-slide v-for="(item,indexbanner) in getBannerList" :key="indexbanner">
                  <img :src="item.ba_path" alt="">
                </swiper-slide>
                <!-- Optional controls -->
                <div class="swiper-pagination " slot="pagination"></div>
                <!-- <div class="swiper-scrollbar"   slot="scrollbar"></div> -->
              </swiper>
            </div>
          </div>
          <div class="topc_answer">
            <h2>问答</h2>
            <ul>
              <li style="margin-left: 18px;" v-for="(item,index) in getQuestionList" @click="canall">
                <h3>{{item.qu_content}}</h3>
                <p>{{item.qu_answer}}</p>
              </li>
            </ul>
            <p @click="canall">查看全部</p>
            <h2>服务情况</h2>
            <div class="answer_nok">
              <swiper :options="swiperOptionService" ref="mySwiperService" v-if="getServiceList.length > 1">
                <!-- slides -->
                <swiper-slide v-for="(item,index) in getServiceList" :key="index">
                  <div style="height: 97px;">
                    <h3>{{item.address}} <span>{{item.mobile}}</span></h3>
                    <p style="-webkit-line-clamp: 1;line-clamp: 1;">{{item.ser_content}}</p>
                  </div>
                </swiper-slide>
                <!-- Optional controls -->
                <!--<div class="swiper-pagination "  slot="pagination"></div>-->
                <!-- <div class="swiper-scrollbar"   slot="scrollbar"></div> -->
              </swiper>
            </div>
            <!--<ul class="answer_no">-->
            <!--<li v-for="(item,index) in getServiceList">-->
            <!--<h3>{{item.address}} <span>{{item.mobile}}</span></h3>-->
            <!--<p style="-webkit-line-clamp: 1;line-clamp: 1;">{{item.ser_content}}</p>-->
            <!--</li>-->
            <!--</ul>-->
          </div>
        </div>
      </div>
      <!--品牌中心-->
      <div class="topc brand">
        <span class="brand_span">查看全部&nbsp;&nbsp;&gt;</span>
        <img src="../../static/image/sy_37.png" alt="" class="brand_img1">
        <img src="../../static/image/sy_8.png" alt="" class="brand_img2">
        <ul class="brand_ul1">
          <li v-for="(item,index) in getBrandCenterList">
            <img src="../../static/image/e_1111.png" alt="" class="brand_ul1img_1">
            <img :src="item.bc_image" alt="" class="brand_ul1img_2">
            <p>{{item.ca_name}}</p>
          </li>
        </ul>
      </div>
      <!--服务案例-->
      <div class="service"
           :style="{'background': 'url('+getMultiArticleImg.fuwuanli+') no-repeat;background-position: right;background-size: 62%;'}">
        <div class="topc brand">
          <div class="brand_service">
            <span class="brand_span" style="top: 77px;" @click="activeall('服务案例')">查看全部&nbsp;&nbsp;&gt;</span>
            <img src="../../static/image/sy_38.png" alt="" class="brand_img1 service_img">
            <div class="brand_new service_new">
              <ul class="brand_ul2 brand_service_ul">
                <li v-for="(item,index) in getMultiArticleList.anli" @click="servicedetail(item.ar_id)">
                  <h3>{{item.ar_title}}</h3>
                  <p v-html="item.ar_introduce">2018年我们得技术上请教了还贵2018年我们得技术上请教了还贵2018年我们得技术上请教了还贵2018年我们得技术上请教了还贵</p>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
      <!--最新政策-->
      <div class="topc brand">
        <span class="brand_span" @click="activeall('最新政策')">查看全部&nbsp;&nbsp;&gt;</span>
        <img src="../../static/image/sy_13.png" alt="" class="brand_img1">
        <div class="brand_new">
          <img :src="getMultiArticleImg.zuixinzhengce" alt="">
          <ul class="brand_ul2">
            <li v-for="(item,index) in getMultiArticleList.zhengce" @click="servicedetail(item.ar_id)">
              <h3>{{item.ar_title}}</h3>
              <p v-html="item.ar_introduce"></p>
            </li>
          </ul>
        </div>
      </div>
      <!--车市新闻-->
      <div class="nav_k">
        <div class="topc brand_news">
          <ul class="brand_newscar">
            <li>
              <div class="new_carimg">
                <img :src="getMultiArticleImg.cheshixinwen" alt="">
                <div>车市新闻</div>
              </div>
              <h3 v-html="getMultiArticleListxinwen.ar_title"
                  @click="servicedetail(getMultiArticleListxinwen.ar_id)"></h3>
              <p>{{getMultiArticleListxinwen.date}}</p>
              <ul>
                <li v-for="(item,index) in getMultiArticleList.xinwen" v-if="index >0"
                    @click="servicedetail(item.ar_id)"><span></span>{{item.ar_title}}
                </li>
              </ul>
              <div class="more" @click="activeall('车市新闻')">查看更多</div>
            </li>
            <li>
              <div class="new_carimg">
                <img :src="getMultiArticleImg.yongchebaike" alt="">
                <div>用车百科</div>
              </div>
              <h3 v-html="getMultiArticleListbaike.ar_title" @click="servicedetail(getMultiArticleListbaike.ar_id)">
                重磅！2018全国及31省市新能源汽车胡铁铮除恶能源汽车胡铁铮除</h3>
              <p>{{getMultiArticleListbaike.date}}</p>
              <ul>
                <li v-for="(item,index) in getMultiArticleList.baike" v-if="index >0"
                    @click="servicedetail(item.ar_id)"><span></span>{{item.ar_title}}
                </li>
              </ul>
              <div class="more" @click="activeall('用车百科')">查看更多</div>
            </li>
            <li>
              <div class="new_carimg">
                <img :src="getMultiArticleImg.zhuantilanmu" alt="">
                <div>专题栏目</div>
              </div>
              <h3 v-html="getMultiArticleListzhuanti.ar_title"
                  @click="servicedetail(getMultiArticleListzhuanti.ar_id)"></h3>
              <p>{{getMultiArticleListzhuanti.date}}</p>
              <ul>
                <li v-for="(item,index) in getMultiArticleList.zhuanti" v-if="index >0"
                    @click="servicedetail(item.ar_id)"><span></span>{{item.ar_title}}
                </li>
              </ul>
              <div class="more" @click="activeall('专题栏目')">查看更多</div>
            </li>
          </ul>
        </div>
      </div>
      <!--合作伙伴-->
      <div class="topc brand">
        <img src="../../static/image/sy_42.png" alt="" class="brand_img1" style=" width: 390px;">
        <img src="../../static/image/sy_44.png" alt="" class="brand_img2">
        <div class="brand-button-next" @click="next"></div>
        <div class="brand-button-prev" @click="prev"></div>
        <div class="scroll coper_swiper swiper-container-horizontal">
          <swiper :options="swiperOptioncoper" ref="mySwipercoper" v-if="getPartherList.length > 1">
            <!-- slides -->
            <swiper-slide v-for="(item,index) in getPartherList" :key="index">
              <img :src="item.pa_image" alt="">
            </swiper-slide>
            <!-- Optional controls -->
            <div class="swiper-button-prev swiper-button-black" slot="button-prev"></div>
            <div class="swiper-button-next swiper-button-black" slot="button-next"></div>
            <!-- <div class="swiper-scrollbar"   slot="scrollbar"></div> -->
          </swiper>
        </div>
        <!--<div class="coper_swiper">-->
        <!--&lt;!&ndash; Swiper &ndash;&gt;-->
        <!--<div class="swiper-container swiper-container-horizontal">-->
        <!--<div class="swiper-wrapper">-->
        <!--<div class="swiper-slide swiper-slide-active" data-swiper-slide-index="0">-->
        <!--<img src="../../static/image/h_0.png" alt="">-->
        <!--</div>-->
        <!--<div class="swiper-slide swiper-slide-next" data-swiper-slide-index="1">-->
        <!--<img src="../../static/image/h_3.png" alt="">-->
        <!--</div>-->
        <!--<div class="swiper-slide" data-swiper-slide-index="2">-->
        <!--<img src="../../static/image/h_4.png" alt="">-->
        <!--</div>-->
        <!--<div class="swiper-slide" data-swiper-slide-index="3">-->
        <!--<img src="../../static/image/h_5.png" alt="">-->
        <!--</div>-->
        <!--</div>-->
        <!--&lt;!&ndash; Add Arrows &ndash;&gt;-->
        <!--<div class="swiper-button-next" tabindex="0" role="button" aria-label="Next slide"></div>-->
        <!--<div class="swiper-button-prev" tabindex="0" role="button" aria-label="Previous slide"></div>-->
        <!--</div>-->
        <!--</div>-->
      </div>
      <div class="change_pass about_us">
        <!--关于我们-->
        <div class="topc brand about_us_center">
          <!--<span class="brand_span" @click="activeall('关于我们')">查看全部&nbsp;&nbsp;&gt;</span>-->
          <img src="../../static/image/sy_40.png" alt="" class="brand_img1" style=" width: 390px;">
          <ul class="brand_ul3">
            <li v-for="(item,index) in getMultiArticleList.about" @click="servicedetail(item.ar_id)">
              <img :src="item.ar_image" alt="" class="">
              <div>
                <h3>{{item.ar_title}}</h3>
                <p v-html="item.ar_introduce"></p>
              </div>
            </li>
          </ul>
        </div>
      </div>
      <!--友情链接-->
      <div class="topc brand friendlink_c">
        <ul class="friendlink">
          <li>友情链接:</li>
          <li v-for="(item,index) in getLinkList">
            <a :href="item.fl_link" target="_blank">{{item.fl_name}}</a>
          </li>
        </ul>
      </div>
    </div>
    <div>
      <Footer></Footer>
    </div>
  </div>
</template>

<script>
  import Header from './Header'
  import Footer from './Footer'

  let $ = require('jquery')
  import 'swiper/dist/css/swiper.css'
  import {swiper, swiperSlide} from 'vue-awesome-swiper'

  export default {
    name: 'home',
    components: {
      swiper,
      swiperSlide,
      'Header': Header,
      'Footer': Footer
    },
    data () {
      return {
        show: true,
        limit: 2,
        getQuestionList: [],
        page: 0,
        getServiceList: [],
        getBrandCenterList: [],
        getLinkList: [],
        navlist: [
          [
            {
              la_id: '',
              la_name: '热门车型'
            }
          ],
          ['服务保障', '安全保障'],
          [],
          ['主题论坛', '品牌论坛', '地区论坛', '车系俱乐部'],
          ['爱车测评', '服务测评']
        ],
        cate: [
          {'name': '最新政策', 'limit': 3, 'key': 'zhengce'},
          {'name': '服务案例', 'limit': 3, 'key': 'anli'},
          {'name': '车市新闻', 'limit': 6, 'key': 'xinwen'},
          {'name': '用车百科', 'limit': 6, 'key': 'baike'},
          {'name': '专题栏目', 'limit': 6, 'key': 'zhuanti'},
          {'name': '关于我们', 'limit': 4, 'key': 'about'}
        ],
        getMultiArticleList: {},
        getMultiArticleImg: {},
        getHotBrandList: [],
        getIndexSearchList: [],
        getBannerList: [],
        mySwiper: {},
        mySwiperService: {},
        getMultiArticleListxinwen: {},
        getMultiArticleListbaike: {},
        getMultiArticleListzhuanti: {},
        getPartherList: [],
        swiperOptionService: {
          slidesPerView: 2,
          slidesPerGroup: 2,
          notNextTick: true,
          observer: true,
          observeParents: true,
          // 循环
          loop: true,
          // 设定初始化时slide的索引
          initialSlide: 0,
          // 自动播放
//          autoplay: true,
          autoplay: {
            delay: 3000,
            stopOnLastSlide: false,
            disableOnInteraction: false
          },
          // 设置轮播
          effect: 'slide',
          // 滑动速度
          speed: 800,
          navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev'
          },
          // 滑动方向
          direction: 'vertical',
          // 小手掌抓取滑动
          // grabCursor : true,
          // 滑动之后回调函数
          on: {
            slideChangeTransitionEnd: function () {
            }
          },
          // 分页器设置
          pagination: {
            el: '.swiper-pagination',
            clickable: true
          }
        },
        swiperOptioncoper: {
          slidesPerView: 4,
          slidesPerGroup: 4,
          notNextTick: true,
          observer: true,
          observeParents: true,
          // 循环
          loop: true,
          // 设定初始化时slide的索引
          initialSlide: 0,
          // 自动播放
//          autoplay: true,
          autoplay: {
            delay: 3000,
            stopOnLastSlide: false,
            disableOnInteraction: true
          },
          // 设置轮播
          effect: 'slide',
          // 滑动速度
          speed: 800,
          navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev'
          },
          // 滑动方向
          direction: 'horizontal',
          // 小手掌抓取滑动
          // grabCursor : true,
          // 滑动之后回调函数
          on: {
            slideChangeTransitionEnd: function () {
            }
          },
          // 分页器设置
          pagination: {
            el: '.swiper-pagination',
            clickable: true
          }
        },
        swiperOption: {
          notNextTick: true,
          // 循环
          observer: true,
          observeParents: true,
          loop: true,
          // 设定初始化时slide的索引
          initialSlide: 0,
          // 自动播放
//          autoplay: true,
          autoplay: {
            delay: 3000,
            stopOnLastSlide: false,
            disableOnInteraction: true
          },
          // 设置轮播
          effect: 'slide',
          // 滑动速度
          speed: 800,
          // 滑动方向
          direction: 'horizontal',
          // 小手掌抓取滑动
          // grabCursor : true,
          // 滑动之后回调函数
          on: {
            slideChangeTransitionEnd: function () {
            }
          },
          // 分页器设置
          pagination: {
            el: '.swiper-pagination',
            clickable: true
          }
        },
        swiperSlides: [1, 2, 3, 4]
      }
    },
    methods: {
      proudce: function (item) {
        let routeUrl = this.$router.resolve({
          path: '/ProduceList',
          query: {
            cate: item.la_name,
            la_id: item.la_id
          }
        })
        window.open(routeUrl.href, '_self')
      },
      toBbs: function (index) {
        let link = ''
        if (index === 0) {
          link = '/Forums/Theme'
        }
        if (index === 1) {
          link = '/Forums/Brand'
        }
        if (index === 2) {
          link = '/Forums/Area'
        }
        if (index === 3) {
          link = '/Forums/CarsClub'
        }
        this.$router.push(link)
      },
      prev: function () {
        $('.swiper-button-prev').click()
      },
      next: function () {
        $('.swiper-button-next').click()
      },
      vehiclecenter: function (cate) {
        let routeUrl = this.$router.resolve({
          path: '/VehicleCenter',
          query: {
            cate: cate
          }
        })
        window.open(routeUrl.href, '_self')
      },
      consult: function (type, cate, id) {
        let routeUrl = this.$router.resolve({
          path: '/Revehicle/ServiceCase',
          query: {
            type: type,
            cate: cate,
            ca_id: id
          }
        })
        window.open(routeUrl.href, '_self')
      },
      activeall: function (cate) {
        let routeUrl = this.$router.resolve({
          path: '/Revehicle/ServiceCase',
          query: {
            cate: cate
          }
        })
        window.open(routeUrl.href, '_self')
      },
      servicedetail: function (arid) {
        let routeUrl = this.$router.resolve({
          path: '/Revehicle/ServiceDetail',
          query: {
            ar_id: arid,
            cate: 1
          }
        })
        window.open(routeUrl.href, '_self')
      },
      canall: function () {
        let routeUrl = this.$router.resolve({
          path: '/Revehicle/AnswerList'
        })
        window.open(routeUrl.href, '_self')
      },
      // ry 获取资讯分类
      getClassification: function () {
        let that = this
        that.$chaos.ajax({
          url: '/User/getInformationTypeList',
          callback: function (type, res) {
            if (type === 'success') {
              that.navlist[2] = res.result.list
            }
          }
        })
      },
      verify: function () {
        let thisObj = this
        thisObj.getClassification()
        // 获取轮播图列表
        thisObj.$chaos.ajax({
          data: {},
          slient: true,
          userinfo: false,
          url: 'Index/getBannerList',
          callback: function (type, res) {
            if (res.status === 'SUCCESS') {
              thisObj.getBannerList = res.result.list
            } else {
              thisObj.$vux.toast.show({
                text: res.result.msg,
                type: 'text',
                width: '180px',
                position: 'bottom'
              })
            }
          }
        })
        // 获取热门品牌
        thisObj.$chaos.ajax({
          data: {},
          slient: true,
          userinfo: false,
          url: 'Index/getHotBrandList',
          callback: function (type, res) {
            if (res.status === 'SUCCESS') {
              thisObj.getHotBrandList = res.result.list
            } else {
              thisObj.$vux.toast.show({
                text: res.result.msg,
                type: 'text',
                width: '180px',
                position: 'bottom'
              })
            }
          }
        })
        // 首页的精准搜索
        thisObj.$chaos.ajax({
          data: {},
          slient: true,
          userinfo: false,
          url: 'Car/getIndexSearchList',
          callback: function (type, res) {
            if (res.status === 'SUCCESS') {
              thisObj.getIndexSearchList = res.result.list
            } else {
              thisObj.$vux.toast.show({
                text: res.result.msg,
                type: 'text',
                width: '180px',
                position: 'bottom'
              })
            }
          }
        })
        // 获取问答列表
        thisObj.$chaos.ajax({
          data: {
            page: thisObj.page,
            limit: thisObj.limit
          },
          slient: true,
          userinfo: false,
          url: 'Index/getQuestionList',
          callback: function (type, res) {
            if (res.status === 'SUCCESS') {
              thisObj.show = true
              thisObj.getQuestionList = res.result.list
            } else {
              thisObj.show = true
              thisObj.$vux.toast.show({
                text: res.result.msg,
                type: 'text',
                width: '180px',
                position: 'bottom'
              })
            }
          }
        })
        // 获取服务情况
        thisObj.$chaos.ajax({
          data: {},
          slient: true,
          userinfo: false,
          url: 'Index/getServiceList',
          callback: function (type, res) {
            if (res.status === 'SUCCESS') {
              thisObj.getServiceList = res.result.list
            } else {
              thisObj.$vux.toast.show({
                text: res.result.msg,
                type: 'text',
                width: '180px',
                position: 'bottom'
              })
            }
          }
        })
        // 获取合作伙伴
        thisObj.$chaos.ajax({
          data: {},
          slient: true,
          userinfo: false,
          url: 'Index/getPartherList',
          callback: function (type, res) {
            if (res.status === 'SUCCESS') {
              thisObj.getPartherList = res.result.list
            } else {
              thisObj.$vux.toast.show({
                text: res.result.msg,
                type: 'text',
                width: '180px',
                position: 'bottom'
              })
            }
          }
        })
        // 获取品牌中心
        thisObj.$chaos.ajax({
          data: {
            page: thisObj.page,
            limit: 6
          },
          slient: true,
          userinfo: false,
          url: 'Index/getBrandCenterList',
          callback: function (type, res) {
            if (res.status === 'SUCCESS') {
              thisObj.getBrandCenterList = res.result.list
            } else {
              thisObj.$vux.toast.show({
                text: res.result.msg,
                type: 'text',
                width: '180px',
                position: 'bottom'
              })
            }
          }
        })
        // 友情链接
        thisObj.$chaos.ajax({
          data: {},
          slient: true,
          userinfo: false,
          url: 'Index/getLinkList',
          callback: function (type, res) {
            if (res.status === 'SUCCESS') {
              thisObj.getLinkList = res.result.list
            } else {
              thisObj.$vux.toast.show({
                text: res.result.msg,
                type: 'text',
                width: '180px',
                position: 'bottom'
              })
            }
          }
        })
        // 产品下的二级导航
        thisObj.$chaos.ajax({
          data: {
            type: '车型'
          },
          slient: true,
          userinfo: false,
          url: 'User/getLabelList',
          callback: function (type, res) {
            if (res.status === 'SUCCESS') {
              var list = res.result.list
              thisObj.navlist[0] = thisObj.navlist[0].concat(list)
            } else {
              thisObj.$vux.toast.show({
                text: res.result.msg,
                type: 'text',
                width: '180px',
                position: 'bottom'
              })
            }
          }
        })
        // 资讯下的二级导航
        thisObj.$chaos.ajax({
          data: {
            type: '车型'
          },
          slient: true,
          userinfo: false,
          url: 'User/getInformationTypeList',
          callback: function (type, res) {
            if (res.status === 'SUCCESS') {
              var list = res.result.list
              // thisObj.navlist[2] = thisObj.navlist[2].concat(list)
              thisObj.navlist[2] = list
            } else {
              thisObj.$vux.toast.show({
                text: res.result.msg,
                type: 'text',
                width: '180px',
                position: 'bottom'
              })
            }
          }
        })
        // 文章列表和图片参数
        thisObj.$chaos.ajax({
          data: {
            cate: thisObj.cate,
            json_status: ''
          },
          slient: true,
          userinfo: false,
          url: 'User/getMultiArticleList',
          callback: function (type, res) {
            if (res.status === 'SUCCESS') {
              thisObj.getMultiArticleList = res.result.list
              thisObj.getMultiArticleListxinwen = res.result.list.xinwen[0]
              thisObj.getMultiArticleListbaike = res.result.list.baike[0]
              thisObj.getMultiArticleListzhuanti = res.result.list.zhuanti[0]
              thisObj.getMultiArticleImg = res.result.image
            } else {
              thisObj.$vux.toast.show({
                text: res.result.msg,
                type: 'text',
                width: '180px',
                position: 'bottom'
              })
            }
          }
        })
      }
    },
    computed: {
      swiper () {
        return this.$refs.mySwiper.swiper
      },
      swipercoper () {
        return this.$refs.mySwipercoper.swiper
      },
      swiperService () {
        return this.$refs.myswiperService.swiper
      }
    },
    created: function () {
      let that = this
      this.verify()
      if (decodeURI(that.$chaos.getQueryString('froml'))) {
        this.$emit('discoverConcat')
      }
    },
    activated () {
      let that = this
      if (decodeURI(that.$chaos.getQueryString('froml'))) {
        this.$emit('discoverConcat')
      }
      if (decodeURI(that.$chaos.getQueryString('access_token'))) {
        that.$chaos.setAccessToken(decodeURI(that.$chaos.getQueryString('access_token')))
      }
    }
  }
</script>
